<!DOCTYPE HTML>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,aItemress=no">
	<title>我的拼团</title>
	<link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
	<link rel="stylesheet" type="text/css" href="../../../css/app.css" />
	<style type="text/css">
		.aui-tab-item {
			font-size: 0.8rem;
			color: #666666;
			font-weight: 600;
			height: 2.5rem;
			line-height: 2.5rem;
		}

		.pintuan-list-goods {
			height: 4.85rem;
			display: flex;
			flex-wrap: row;
			justify-content: flex-start;
			align-items: flex-start;
			padding-top: 0.8rem;
			box-sizing: border-box;
			margin-left: 0.8rem;
			margin-right: 0.8rem;
		}

		.pintuan-list-goods-img {
			width: 3.2rem;
			height: 3.2rem;
			display: inline-block;
		}

		.goods-tag {
			color: #FF6642;
			font-size: .5rem;
			/*border: 1px solid rgba(255,102,66,1);*/
			background-color: rgba(255, 102, 66, .1) !important;
			border-radius: .15rem;
			/*padding: 0 .15rem;*/
			white-space: nowrap;
			/*margin: .15rem 0;*/
			margin-right: .25rem;
			display: inline-block;
			height: .8rem;
			line-height: .8rem;
		}

		.pintuan-price {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			/*margin-top: 0.3rem;*/
			margin-left: -.2rem;
			margin-top:1rem
		}

		.pintuan-list-goods-infor {
			flex: 1;
			padding-left: .6rem;
		}

		.pintuan-state {
			height: 2.5rem;
			line-height: 2.5rem;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
		}

		.aui-btn {
			font-size: .8rem;
			height: 1.6rem;
			line-height: 1.6rem;
			width: 4.5rem;
			padding: 0!important;
			border-radius: 1.5rem;
			margin-left: 0.5rem;
		}

		.btn-hui {
			color: #666666;
			background-color: #FFFFFF;
			border: 1px solid #E6E6E6;
		}
		/*拼团导航栏*/

		.tab-item-list {
			width: 2.75rem;
			height: 2.2rem;
			text-align: center;
			line-height: 2.2rem;
			font-size: 0.75rem;
			font-family: PingFangSC-Regular;
			font-weight: 400;
			color: rgba(34, 34, 34, 1);
		}

		.aui-text-linear-new {
			color: #005A93 !important;
			font-family: PingFangSC-Medium;
			font-weight: 500!important;
			border-bottom: 0.1rem solid #005A93;
			border-radius: 0.05rem;
		}
		.current_price{font-size:1rem;color:#4D4D4D}
		.cost_price{text-decoration: line-through;font-size:0.65rem;color:#999;padding-left:0.2rem}
		.aui-font-size-10{font-size:0.7rem !important}
	</style>
</head>

<body>
	<div id="app">

		<div class="pintuan-list" style="margin-top:0.5rem">
			<div v-for="vo in info" class="ming-bg-white" @touchstart="gtouchstart(vo.id)" ontouchmove="gtouchmove()" ontouchend="gtouchend()" style="border-bottom:0.5rem solid #F6F6F6">
				<!-- {{vo.sold_num}} -->
				<div class="pintuan-list-goods" style="border-bottom:0.05rem solid rgba(238,238,238,0.5);">
					<div class="pintuan-list-goods-img">
						<img :src="vo.good.cover" style="border-radius:0.2rem;">
					</div>
					<div class="pintuan-list-goods-infor" tapmode @click="openWin_goods_detail(vo.good_id)" style="padding-right:.6rem;width:13.35rem;padding-left:0.6rem;">
						<div class="aui-ellipsis-1" style="overflow:hidden;font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(50,50,51,1);">
							{{vo.good.title}}
						</div>

						<div class="pintuan-price">
							<div class="" style="display:inline-block;color:#333333;">
									<!-- <span class=""style="font-size: .75rem;font-family:PingFangSC-Medium;font-weight:500;">￥<span class="" style="font-size:0.75rem">{{price_format('yuan',vo.good.tuan_price)}}</span></span><span class="" style="font-size:0.6rem;font-family:PingFangSC-Medium;font-weight:500;color:rgba(51,51,51,1);">.{{price_format('fen',vo.good.tuan_price)}}</span> -->
									<span class="current_price">￥{{vo.good.current_price}}</span>
									<span class="cost_price">￥{{vo.good.cost_price}}</span>
							</div>
							<div class="aui-font-size-10" style="padding:0 0.25rem;font-size:1rem;font-weight:400;color:#005A93;font-family:PingFangSC-Regular;">
								{{vo.tuan_uid_num}}人成团
							</div>
						</div>
					</div>
				</div>
				<div class="" style="padding:0 .75rem;padding-left:0.8rem;padding-bottom:0.1rem;">
					<div v-if="vo.result.status==3||vo.result.status==4" class="pintuan-state">
						<div class="aui-font-size-15" style="font-size:0.75rem;font-family:PingFangSC-Regular;font-weight:400;color:#F73024;">
							进行中
						</div>
						<div>

							<span class="aui-btn btn-hui" tapmode @click="openWin_pintuan_details(vo.tuan_uid_id)" style="font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(153,153,153,1);border:0.03rem solid rgba(221,221,221,1);">
								拼团详情
							</span><span class="aui-btn ming-text-white aui-bg-linear btn-bg aui-font-size-14" tapmode @click="sharepage(vo.good_id,vo.good.title,vo.good.cover)" style="font-size: 0.7rem;font-family: PingFangSC-Regular;font-weight: 400;color: rgba(255, 255, 255, 1);">
								邀请好友
							</span>
						</div>
					</div>
					<div v-if="vo.result.status==1" class="pintuan-state">
						<div class="aui-font-size-16" style="font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:#F73024;">
							拼购成功
						</div>
						<div class="">
							<span class="aui-btn btn-hui" tapmode @click="openWin_pintuan_details(vo.tuan_uid_id)" style="font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(153,153,153,1);border:0.03rem solid rgba(221,221,221,1);">
								拼团详情
							</span>
							<!--<span v-if="vo.result.status==1" class="aui-btn ming-text-white aui-bg-linear" tapmode @click="openWin_pintuan_details(vo.id)">
								立即下单
							</span>-->
						</div>
					</div>
					<div v-if="vo.result.status==2" class="pintuan-state">
						<div class="aui-font-size-16" style="font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:#F73024;">
							拼团失败
						</div>
						<div class="">
							<span class="aui-btn btn-hui" tapmode @click="openWin_pintuan_details(vo.tuan_uid_id)" style="border:0.03rem solid rgba(221,221,221,1);font-size:0.7rem;font-family:PingFangSC-Regular;font-weight:400;color:rgba(153,153,153,1);">
								拼团详情
							</span>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div v-if="info.length<1" class="aui-text-center" style="margin-top: 40%;">
			<!-- 此处图片暂未更换 -->
			<img src="../../../image/bg/bg-nonedan.png" style="width:7.55rem;margin-left:50%;transform:translateX(-50%);margin-bottom:1rem" />
			<div class="aui-margin-t-10" style="font-size:0.75rem;font-family:PingFangSC-Regular;font-weight:400;color:#B3B3B3;">
				暂无拼团信息
			</div>
			<div class="aui-text-center" tapmode onclick="openWin_goods_list_type('all')">
				<div class="aui-btn" style="display:inline-block;margin-top: 1.5rem;width:10rem;border-radius:0.3rem;height:2.3rem;line-height:2.3rem;text-align:center;background:#005A93;color:#fff;font-size:.8rem;font-family:PingFangSC-Regular;font-weight:400;">
					去逛逛
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="../../../script/api.js"></script>
<script type="text/javascript" src="../../../script/vue.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/aui-dialog.js"></script>
<script>
	var vm = new Vue({
		el: '#app',
		data: {
			index: 'all',
			info: [],
			page: 1,
			loadmore: true
		},
		methods: {
			get_list: function() {
				get_data('api/Tuan/myTuanList', {
					token: $api.getStorage('token'),
					status: vm.index
				}, function(ret) {
					console.log(JSON.stringify(ret))
					if (ret.status) {
						vm.info = ret.data
							//							if(ret.data.length < 20) {
							//								vm.loadmore = false
							//							}
							//							ret.data.forEach(function(el) {
							//								vm.info.push(el)
							//							})
					}
				})
			},
			price_format: function(type, price) {
				var price = (price / 100).toFixed(2);
				var status = (price + '').indexOf('.')
				if (status == '-1') {
					if (type == 'yuan') {
						return price;
					}
					if (type == 'fen') {
						return '00';
					}
				}
				var price_array = (price + '').split('.')
				if (type == 'yuan') {
					return price_array[0];
				}
				if (type == 'fen') {
					var price_fen = price_array[1].length < 2 ? price_array[1] + '0' : price_array[1];
					return price_fen;
				}
			}

		}
	})
	apiready = function() {
		vm.get_list()
		add_event('logined', function(ret) {
			vm.get_list()
		})
		// fnInitPullRefresh(function() {
		// 		vm.page = 1;
		// 		vm.loadmore = true
		// 		vm.info = [];
		// 		vm.get_list()
		// 	})
			// 新版刷新
		refresh_new(function() {
			setTimeout(function() {
				vm.page = 1;
				vm.loadmore = true
				vm.info = [];
				vm.get_list()
				api.refreshHeaderLoadDone()
			}, 1000)
		})
		fnInitScrollToBottom(function() {
				if (vm.loadmore) {
					vm.page++;
					vm.get_list()
				}
			})
			fnInitPullRefresh(function() {
			vm.page = 1;
			vm.loadmore = true
			vm.info = [];
			vm.get_list();
			api.refreshHeaderLoadDone();

		})
			//首页顶部最新按钮跟点赞数按钮点击时触发
		add_event('pintuan_index', function(ret) {
			vm.index = ret.index
			vm.info = [];
			vm.page = 1;
			vm.loadmore = true
			vm.get_list()
		})
	};

	function tapindex(index) {
		if (vm.index != index) {
			vm.index = index
			vm.get_list()
		}
	}
	var timeOutEvent = 0;

	function gtouchstart(index) {
		api.addEventListener({
			name: 'longpress'
		}, function(ret, err) {
			longPress(index);
		});
		return false;
	};

	function gtouchend() {
		clearTimeout(timeOutEvent);
		if (timeOutEvent != 0) {
			//这里写要执行的内容（尤如onclick事件）
			//				console.log("你这是点击，不是长按");
		}
		return false;
	};

	function gtouchmove() {
		clearTimeout(timeOutEvent);
		timeOutEvent = 0;
		console.log("你移动了啊");
	};


	function longPress(index) {
		timeOutEvent = 0;
		del_item(index)
	}

	// var timeOutEvent = 0;
	//
	// function gtouchstart(index) {
	// 	timeOutEvent = setTimeout(function() {
	// 		longPress(index)
	// 	}, 500);
	// 	return false;
	// };
	//
	// function gtouchend() {
	// 	clearTimeout(timeOutEvent);
	// 	if (timeOutEvent != 0) {
	// 		//这里写要执行的内容（尤如onclick事件）
	// 		//			console.log("你这是点击，不是长按");
	// 	}
	// 	return false;
	// };
	//
	// function gtouchmove() {
	// 	clearTimeout(timeOutEvent);
	// 	timeOutEvent = 0;
	// };
	//
	// function longPress(index) {
	// 	timeOutEvent = 0;
	// 	//执行长按要执行的内容，如弹出菜单
	// 	del_item(index)
	// }

	function del_item(id) {
		var dialogBox = api.require('dialogBox');
		dialogBox.alert({
			texts: {
				title: '提示',
				content: '确定要删除这条拼团信息吗？',
				leftBtnTitle: '取消',
				rightBtnTitle: '确认'
			},
			styles: {
				bg: '#fff',
				w: 295,
				corner: 10,
				title: {
					marginT: 20,
					titleSize: 17,
					titleColor: '#444444'
				},
				content: {
					marginT: 18,
					marginB: 30,
					color: '#444444',
					size: 17
				},
				left: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					// bg: 'widget://image/ico/ico_btn_left_bg.png',
					bg: "#fff",
					color: '#999999',
					size: 16
				},
				right: {
					marginB: 0,
					marginL: 0,
					w: 147.5,
					h: 55,
					corner: 10,
					bg: '#fff',
					color: '#005A93',
					size: 16
				},
				horizontalLine: {
					color: '#EEEEEE',
					height: 1
				},
				verticalLine:{
	        color:'#EEEEEE', //（可选项）字符串类型；左右按钮中间竖线的颜色，支持rgb、rgba、#；默认：'rgba(245,245,245,0)'
		      width:1                 //（可选项）数字类型；左右边按钮竖线的高度；默认：0
		    }
			}
		}, function(ret) {
			if (ret.eventType == 'left') {
				var dialogBox = api.require('dialogBox');
				dialogBox.close({
					dialogName: 'alert'
				});
			} else if (ret.eventType == 'right') {
							get_data('api/tuan/delMyTuan', {
								token: $api.getStorage('token'),
								id: id
							}, function(ret) {
								if (ret.status) {
									toast('删除成功')
									vm.get_list()
								}
							})
				var dialogBox = api.require('dialogBox');
				dialogBox.close({
					dialogName: 'alert'
				});
			}
		});
		// var dialog = new auiDialog();
		// dialog.alert({
		// 	title: "提示",
		// 	msg: '确定要删除这条拼团信息吗？',
		// 	buttons: ['取消', '确定']
		// }, function(ret) {
		// 	if (ret) {
		// 		if (ret.buttonIndex == '2') {
		// 			get_data('api/tuan/delMyTuan', {
		// 				token: $api.getStorage('token'),
		// 				id: id
		// 			}, function(ret) {
		// 				if (ret.status) {
		// 					toast('删除成功')
		// 					vm.get_list()
		// 				}
		// 			})
		// 		}
		// 	}
		// })
	}


	function sharepage(id, title, share_pic) {
		if (!$api.getStorage('token')) {
			openWin_login()
			return;
		}
		var dialogBox = api.require('dialogBox');
		dialogBox.actionMenu({
			animation: true,
			isCuttingLine: true,
			tapClose: true,
			rect: {
				h: 197
			},
			texts: {
				cancel: '取消'
			},
			items: [{
				text: '朋友圈',
				icon: 'widget://image/icon/wechatSpace.png'
			}, {
				text: '微信好友',
				icon: 'widget://image/icon/friends.png'
			}],
			styles: {
				bg: '#FFF',
				column: 3,
				itemText: {
					color: '#444444',
					size: 15,
					marginT: 0
				},
				itemIcon: {
					size: 60
				},
				cancel: {
					bg: 'fs://icon.png',
					color: '#666666',
					h: 55,
					size: 15
				}
			}
		}, function(ret) {
			if (ret) {
				if (ret.eventType == "cancel") {
					dialogBox.close({
						dialogName: 'actionMenu'
					});
				}
				if (ret.index == "0") {
					shareTowx('timeline', id, title, share_pic)
					dialogBox.close({
						dialogName: 'actionMenu'
					});
				}
				if (ret.index == "1") {
					shareTowx('session', id, title, share_pic)
					dialogBox.close({
						dialogName: 'actionMenu'
					});
				}
				if (ret.index == "2") {
					shareTowb(id, title, share_pic)
					dialogBox.close({
						dialogName: 'actionMenu'
					});
				}
			}

		});
	}

	// 分享到微信朋友圈
	function shareTowx(type, id, title, share_pic) {
		var contentUrl = 'http://zm.zonmay.com/wap/share/goods/id/' + id + '.html'
		var title = title
		var wx = api.require('wxPlus');
		wx.isInstalled(function(ret, err) {
			if (ret.installed) {} else {
				toast('当前设备未安装微信客户端');
				return;
			}
		});
		wx.shareWebpage({
			scene: type,
			title: title,
			description: title,
			contentUrl: contentUrl,
			thumb: share_pic
		}, function(ret, err) {
			if (ret.status) {
				toast('分享成功');
				get_data('api/user/shareTakeGold', {
					token: $api.getStorage('token')
				}, function(ret) {
					if (ret.status) {
						console.log(JSON.stringify(ret.data))
						vm.share_gold = ret.data.gold
						vm.share_show = true
						setTimeout(function() {
							vm.share_show = false
						}, 3000)
					}
				})
			} else {
				if (err.code == '2') {
					toast('取消分享');
				}
				console.log(err.code);
			}
		});
	}

	// 查看分享链接中的内容
	function shareTowb(id, title, share_pic) {
		var contentUrl = 'http://zm.zonmay.com/wap/share/goods/id/' + id + '.html'
		var title = title
		var weibo = api.require('weiboPlus');
		weibo.shareWebPage({
			text: title + '。详情点击链接查看',
			title: title,
			description: title,
			thumb: share_pic,
			contentUrl: contentUrl
		}, function(ret, err) {
			console.log(JSON.stringify(ret))
			if (ret.status) {
				toast('分享成功');
				get_data('api/user/shareTakeGold', {
					token: $api.getStorage('token')
				}, function(ret) {
					if (ret.status) {
						vm.share_gold = ret.data.gold
						vm.share_show = true
						setTimeout(function() {
							vm.share_show = false
						}, 3000)
					}
				})
			} else {
				if (err.code == '1') {
					toast('取消分享');
				}
				console.log(JSON.stringify(err))
			}
		});
	}
</script>

</html>
